<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Css单位px，rem，em，vw，vh的区别</title>
	</head>
	<body>
		<!--
     px: 是网页设计常用的基本单位，像素px是相对于显示器屏幕分辨率而言的。
     em: 是相对长度单位，是基于父元素的字体大小来计算的，如果父元素字体大小未定义，则以浏览器默认字体大小为基准（浏览器默认字体大小一般为16px），1em = 16px。
     rem: 是CSS3新增的相对长度单位，是基于根元素html的字体大小来计算的，如果html根元素未定义字体大小，则以浏览器默认字体大小为基准（浏览器默认字体大小一般为16px）， 1rem = 16px。

     vw、vh、vmax、vmin: 这四个单位都是基于视口。
     vw是相对视口（viewport）的宽度而定的，长度等于视口宽度的1/100，假如浏览器的宽度为200px，那么1vw就等于2px（200px/100）。
     vh是相对视口（viewport）的高度而定的，长度等于视口高度的1/100，假如浏览器的高度为500px，那么1vh就等于5px（500px/100）。
     vmin和vmax是相对于视口的高度和宽度两者之间的最小值或最大值。
    -->
	</body>
</html>
